<template>
  <div class="modify">
    <el-dialog :visible.sync="visible">
      <div :class="form.bindState === 0 ? 'panelWrap mo-container' : 'panelWrap mo-content'">
        <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20" style="height: 40px">
          <div>修改电梯绑定信息</div>
          <i class="el-icon-close" @click="handleCloseDialog" />
        </div>
        <div class="mo-mian flexcenter flexdc m-t-20">
          <div class="mo-con flex flexdc">
            <div :class="form.bindState === 0 ? 'mo-bind' : ''">
              <div class="m-b-20 bind-res flex flexac">
                <span class="name texttr"><span class="mustval">*</span>位置码：</span>
                <el-input v-model.trim="form.rescueCode" clearable style="width: 240px;" class="inputnumber" type="number" placeholder="请输入注册码" />
              </div>

              <div class="flex flexac bind-reg m-b-20">
                <span class="name texttr"><span class="mustval">*</span>注册代码：</span>
                <el-input v-model.trim="form.registerCode" clearable style="width: 240px;" class="inputnumber" type="number" placeholder="请输入注册代码" />
              </div>
              <div class="flex flexac vill  m-b-20">
                <span class="reg-name texttr"><span class="mustval">*</span>小区：</span>
                <el-input v-model.trim="form.villageName" clearable class="villinput" placeholder="请选择小区" />
                <el-button class="clsoeBtn villbtn m-l-10 el-icon-circle-check" @click="handleSelectvill">选择小区</el-button>
              </div>
            </div>

            <div v-if="form.bindState !== 0">
              <div class="m-b-20 flex flexac">
                <span class="name texttr"><span class="mustval">*</span>场所名称：</span>
                <el-input v-model.trim="form.usePlaceName" clearable readonly class="input" placeholder="请选择场所名称" />
                <el-button type="warning" class="sele-btn plBtn co-btn el-icon-circle-check" @click="handleUsePlace">选择场所</el-button>
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>安全管理员姓名：</span>
                <el-input v-model.trim="form.securityPerson" clearable class="input" placeholder="请输入安全管理员姓名" />
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>安全管理员手机：</span>
                <el-input v-model.trim="form.securityPersonPhone" clearable class="input" type="number" placeholder="请输入安全管理员手机" />
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>使用单位：</span>
                <el-input v-model.trim="form.useUnitName" clearable readonly class="input" placeholder="请选择单位名称" />
                <el-button type="warning" class="sele-btn co-btn unBtn el-icon-circle-check" @click="handleUseUnit">选择使用单位</el-button>
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>保养技术支持单位：</span>
                <el-input v-model.trim="form.supportUnit" clearable class="input" placeholder="如：上海三菱电梯安装维修分公司" />
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>第一维保人：</span>
                <el-input v-model.trim="form.maintenancePerson1Name" clearable readonly class="input" placeholder="请选择第一维保人" />
                <el-button type="warning" class="sele-btn co-btn el-icon-circle-check" @click="handleMaint">选择第一维保人</el-button>
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>第一维保人手机号：</span>
                <el-input v-model.trim="form.maintenancePerson1Phone" clearable readonly class="input" type="number" placeholder="第一维保人手机号" />
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>第二维保人：</span>
                <el-input v-model.trim="form.maintenancePerson2Name" clearable readonly class="input" placeholder="请选择第二维保人" />
                <el-button type="warning" class="sele-btn co-btn el-icon-circle-check" @click="handleSecond">选择第二维保人</el-button>
              </div>

              <div class="flex flexac m-b-20">
                <span class="name texttr"><span class="mustval">*</span>第二维保人手机号：</span>
                <el-input v-model.trim="form.maintenancePerson2Phone" clearable readonly class="input" type="number" placeholder="第二维保人手机号" />
              </div>
            </div>
          </div>

          <div class="mo-footer flex m-b-20">
            <el-button type="success" class="m-r-30 btn el-icon-circle-check" @click="handleUpdate">更 新</el-button>
            <el-button class="clsoeBtn btn el-icon-circle-close" @click="handleCloseDialog">关 闭</el-button>
          </div>
        </div>
      </div>

      <!-- 场所查询 -->
      <FindUsePlace v-model="usePlaceVisible" @update="handleUsePlaceUpdate" />
      <!-- 使用单位查询 -->
      <FindUseUnit v-model="useUnitVisible" @update="handleUseUnitUpdate" />
      <!-- 第一维保人员 -->
      <FindMaintenance v-model="useMaVisible" @update="handleMaiUpdate" />
      <!-- 第二维保人员 -->
      <FindMaSecond v-model="useSecondVisible" @second="handelSecondUpdate" />
    </el-dialog>
    <VillageDialog v-model="villVisible" @update="handleUpdateVill" />
  </div>
</template>

<script>

import VillageDialog from './villageDialog'
import FindUsePlace from '@/components/findUsePlace'
import FindUseUnit from '@/components/findUseUnit'
import FindMaintenance from '@/components/findMaintenance'
import FindMaSecond from '@/components/findMaSecond'
import { elevatorUpdate } from '@/api/elevator/elevator'
import { bindElevator } from '@/api/elevator/elevatorRelationship'
import RegexInput from '@/utils/RegexInput'
import { showNotice } from '@/utils/toolclass'

export default {
  name: 'Modify',
  components: {
    FindUsePlace,
    FindUseUnit,
    FindMaintenance,
    FindMaSecond,
    VillageDialog
  },
  props: {
    value: {
      type: Boolean
    },
    data: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      visible: false,
      usePlaceVisible: false,
      useUnitVisible: false,
      useMaVisible: false,
      useSecondVisible: false,
      villVisible: false,
      form: { ...this.data }
    }
  },
  watch: {
    visible(v) {
      this.$emit('input', v)
    },
    value(v) {
      this.visible = v
    },
    data(v) {
      this.form = { ...v }
    }
  },
  created() {},
  mounted() {},
  methods: {
    handleUsePlace() {
      this.usePlaceVisible = true
    },
    handleUseUnit() {
      this.useUnitVisible = true
    },
    handleMaint() {
      this.useMaVisible = true
    },
    handleSecond() {
      this.useSecondVisible = true
    },
    // 场所查询更新回调
    handleUsePlaceUpdate(row) {
      this.form.usePlaceId = row.id
      this.form.usePlaceName = row.name
    },
    // 使用单位查询更新回调
    handleUseUnitUpdate(row) {
      this.form.useUnitId = row.id
      this.form.useUnitName = row.name
    },
    // 第一维保人员更新回调
    handleMaiUpdate(rows) {
      this.form.maintenancePerson1Id = rows.id
      this.form.maintenancePerson1Name = rows.name
      this.form.maintenancePerson1Phone = rows.phone
    },
    // 第二维保人员更新回调
    handelSecondUpdate(row) {
      this.form.maintenancePerson2Id = row.id
      this.form.maintenancePerson2Name = row.name
      this.form.maintenancePerson2Phone = row.phone
    },
    handleSelectvill() {
      this.villVisible = true
    },
    handleUpdateVill(row) {
      // console.log(row)
      this.form.villageName = row.name
      this.form.villageId = row.id
    },
    handleUpdate() {
      // console.log(this.form)
      if (!(/^\S+$/.test(this.form.rescueCode))) {
        showNotice('error', '提示', '请输入救援代码')
        return
      } else if (!(RegexInput.safeCode(this.form.rescueCode))) {
        showNotice('error', '提示', '位置码格式错误')
        return
      }
      if (!(/^\S+$/.test(this.form.registerCode))) {
        showNotice('error', '提示', '请输入注册代码')
        return
      } else if (!(RegexInput.regCode(this.form.registerCode))) {
        showNotice('error', '提示', '注册代码格式错误')
        return
      }
      if (!(/^\S+$/.test(this.form.villageName))) {
        showNotice('error', '提示', '请选择小区')
        return
      }
      // 新增电梯信息
      const params = {
        bindState: this.form.bindState,
        carNo: this.form.carNo,
        factoryNo: this.form.factoryNo,
        id: this.form.id, // ID
        installAddress: this.form.installAddress,
        internaNo: this.form.internaNo,
        maintenancePerson1: this.form.maintenancePerson1,
        maintenancePerson1Id: this.form.maintenancePerson1Id, //
        maintenancePerson1Name: this.form.maintenancePerson1Name,
        maintenancePerson1Phone: this.form.maintenancePerson1Phone,
        maintenancePerson2Id: this.form.maintenancePerson2Id, //
        maintenancePerson2Name: this.form.maintenancePerson2Name,
        maintenancePerson2Phone: this.form.maintenancePerson2Phone,
        maintenanceUnitId: this.form.maintenanceUnitId, // 维保单位ID
        maintenanceUnitName: this.form.maintenanceUnitName, // 维保单位名称
        manufacturerUnitId: this.form.manufacturerUnitId,
        manufacturerUnitName: this.form.nextInspectionDate,
        nextInspectionDate: this.form.nextInspectionDate,
        operator: this.form.operator,
        registerCode: this.form.registerCode, // 注册代码
        registerDate: this.form.registerDate,
        registerUnit: this.form.registerUnit,
        registerUpdateDate: this.form.registerUpdateDate,
        remark: this.form.remark,
        rescueCode: this.form.rescueCode, // 救援代码（位置码）
        securityPerson: this.form.securityPerson, //
        securityPersonPhone: this.form.securityPersonPhone, //
        supportUnit: this.form.securityPersonPhone, //
        usePlaceId: this.form.usePlaceId, //
        usePlaceName: this.form.usePlaceId, //
        useUnitId: this.form.useUnitId, //
        useUnitName: this.form.useUnitName, //
        version: this.form.version, // 版本号
        villageId: this.form.villageId,
        villageName: this.form.villageName
      }
      if (this.form.bindState === 0) {
        this.handleupdateEle(params)
      } else {
        if (!(/^\S+$/.test(this.form.rescueCode))) {
          showNotice('error', '提示', '请输入救援代码')
          return
        } else if (!(RegexInput.safeCode(this.form.rescueCode))) {
          showNotice('error', '提示', '位置码格式错误')
          return
        }
        if (!(/^\S+$/.test(this.form.registerCode))) {
          showNotice('error', '提示', '请输入注册代码')
          return
        } else if (!(RegexInput.regCode(this.form.registerCode))) {
          showNotice('error', '提示', '注册代码格式错误')
          return
        }
        if (!(/^\S+$/.test(this.form.villageName))) {
          showNotice('error', '提示', '请选择小区')
          return
        }
        if (!(/^\S+$/.test(this.form.usePlaceName))) {
          showNotice('error', '提示', '请选择场所')
          return
        }
        if (!(/^\S+$/.test(this.form.securityPerson))) {
          showNotice('error', '提示', '请输入安全员姓名')
          return
        }
        if (!(/^\S+$/.test(this.form.securityPersonPhone))) {
          showNotice('error', '提示', '请输入安全员电话')
          return
        }
        if (!(/^\S+$/.test(this.form.useUnitName))) {
          showNotice('error', '提示', '请选择使用单位')
          return
        }
        if (!(/^\S+$/.test(this.form.supportUnit))) {
          showNotice('error', '提示', '请输入保养技术支持单位')
          return
        }
        if (!(/^\S+$/.test(this.form.maintenancePerson1Name))) {
          showNotice('error', '提示', '请选择第一维保人')
          return
        }
        if (!(/^\S+$/.test(this.form.maintenancePerson2Name))) {
          showNotice('error', '提示', '请选择第二维保人')
          return
        }
        if (this.form.maintenancePerson1Name === this.form.maintenancePerson2Name || this.form.maintenancePerson1Phone === this.form.maintenancePerson2Phone) {
          showNotice('error', '提示', '维保人不能为同一个人')
          return
        }
        // 电梯绑定
        const paramsAll = {
          id: this.form.id, // ID --
          maintenancePerson1Id: this.form.maintenancePerson1Id, // --
          maintenancePerson2Id: this.form.maintenancePerson2Id, // --
          securityPerson: this.form.securityPerson, // --
          maintenanceUnitId: this.form.maintenanceUnitId,
          securityPersonPhone: this.form.securityPersonPhone, // --
          supportUnit: this.form.supportUnit, // --
          usePlaceId: this.form.usePlaceId, // --
          useUnitId: this.form.useUnitId // --
        }
        this.handleupdateAll(params)
        this.handleEleRelation(paramsAll)
      }
      // console.log(this.form)
    },
    handleupdateEle(data) {
      elevatorUpdate(data).then(res => {
        // console.log(res)
        if (res.code === '000000') {
          showNotice('success', '提示', '更新成功!')
          this.$emit('handleRefresh')
          this.$emit('handleCloseDialog')
        } else {
          if (res.code === '111111') {
            showNotice('error', '提示', '备案未完成，无法使用本模块，请先完成备案')
          } else if (res.msg === '失败') {
            showNotice('error', '提示', '更新失败')
          } else {
            showNotice('error', '提示', res.msg)
          }
        }
      })
    },
    handleEleRelation(data) {
      bindElevator(data).then(res => {
        // console.log(res)
        if (res.code === '000000') {
          showNotice('success', '提示', '更新成功!')
          this.$emit('handleRefresh')
          this.$emit('handleCloseDialog')
        } else {
          if (res.code === '111111') {
            showNotice('error', '提示', '备案未完成，无法使用本模块，请先完成备案')
          } else if (res.msg === '失败') {
            showNotice('error', '提示', '绑定信息更新失败')
          } else {
            showNotice('error', '提示', res.msg)
          }
        }
      })
    },
    handleupdateAll(data) {
      elevatorUpdate(data).then(res => {
        // console.log(res)
        // if (res.code === '000000') {
        //   // showNotice('success', '提示', '更新成功!')
        //   this.$emit('handleRefresh')
        //   // this.$emit('handleCloseDialog')
        // } else {
        //   if (res.code === '111111') {
        //     showNotice('error', '提示', '备案未完成，无法使用本模块，请先完成备案')
        //   } else if (res.msg === '失败') {
        //     showNotice('error', '提示', '更新失败')
        //   } else {
        //     // showNotice('error', '提示', res.msg)
        //   }
        // }
      })
    },
    handleCloseDialog() {
      // this.visible = !this.visible
      this.$emit('handleCloseDialog')
    }
  }
}
</script>

<style lang="scss">
@import '@/styles/public.scss';
.modify {
  .mo-container {
    width: 800px;
    height: 500px;
    background: #ffffff;
    margin-left: -200px;
    .mo-bind {
      margin-bottom: 80px;
      margin-left: -100px;
      .name {
        width: 140px;
        text-align: right;
      }
      .bind-res {
        margin: 60px 0 40px 0;
      }
      .vill {
        // margin-right: 68px;
        margin-left: 90px;
        margin-top: 40px;
        .villinput {
          width: 140px;
        }
        .villbtn {
          width: 90px;
          padding: 12px 0;
        }
      }
    }
  }
  .mo-content {
    width: 800px;
    background: #ffffff;
    margin: -100px 0 0 -200px;
    .mo-mian {
      .mo-con {
        .vill {
          // margin-right: 68px;
          margin-left: 90px;
          .villinput {
            width: 240px;
          }
          .villbtn {
            width: 100px;
            padding: 12px 0;
          }
        }
        .name {
          width: 140px;
          text-align: right;
        }
        .sele-btn {
          margin-left: 10px;
          padding: 12px 6px;
        }
        .input {
          width: 240px;
        }
        .plBtn {
          width: 100px;
        }
      }
    }
  }
}
</style>
